<script lang="ts" setup>
import { ref, watch } from 'vue'
import { ORDER_AFTER_STATUS_LIST } from '@/const/order'

interface IProps {
	value?: any;
	width?: number | string;
	placeholder?: string;
}

const emit = defineEmits(['update:value'])
const props = withDefaults(defineProps<IProps>(), {
	width: 130,
	value: undefined,
	placeholder: '订单状态'
})
const val = ref<any>()

watch(() => props.value, () => {
	val.value = props.value
})

function onChange(value: any) {
	emit('update:value', value)
}
</script>

<template>
	<n-select
		v-model:value="val"
		:consistent-menu-width="false"
		:options="ORDER_AFTER_STATUS_LIST"
		clearable
		:placeholder="placeholder"
		:style="{width:width+'px'}"
		@update-value="onChange"
	/>
</template>

<style lang="less" scoped>
</style>
